<template lang="pug">
.chass
	ul.ground#ground
		li(v-for="c in chassArr" :id="'c_'+c.id" @click="play(c)" :data-x="c.x" :data-y="c.y")
			a(href="javascript:;" v-bind:class="c.status==0?'chass_a':(c.status==1 && c.item==0 && !c.attack)?'chass_b':(c.status==1 && c.item==0 && c.attack)?'chass_d':(c.status==1 && c.item==1 && !c.attack)?'chass_c':(c.status==1 && c.item==1 && c.attack)?'chass_e':''")  {{c.status==0?'':c.status==2?'':c.name}}
	p.explain {{explain}}
</template>

<script>
import list from '../chass'
export default {
  name: 'chass',
  data() {
    return {
      chassArr: [], //棋子
      player: 0, //当前玩家 0红 1黑
      explain: '', //提示语
      isStart: false, //游戏是否开始
      ex_1: '请黑方落子',
      ex_2: '请红方落子',
      local: '',
      iswar: false, //是否是攻击状态
      att_type: false, //炮攻击模式
      fireArr: [],
      flag1: false,
      flag2: false,
      flag3: false,
      flag4: false,
      bing: false, //兵卒模式
      gen: false, //将帅模式
      gameArr: [] //存储全局被吃掉棋子
    }
  },
  mounted() {
    let n = list.sort(this.compare("rand"))
    for (let i = 0; i < 8; i++) {
      n[i]["x"] = i + 1
      n[i + 8 * 1]["x"] = i + 1
      n[i + 8 * 2]["x"] = i + 1
      n[i + 8 * 3]["x"] = i + 1
      n[i]["y"] = 1
      n[i + 8 * 1]["y"] = 2
      n[i + 8 * 2]["y"] = 3
      n[i + 8 * 3]["y"] = 4
    }
    this.chassArr = n
  },
  methods: {
    play: function(chass) {
      //判断当前棋子状态
      if (chass.status == 0) { //棋子为翻面

        //棋子在攻击模式下翻面
        if (this.iswar) {
          console.log(this.local)
          let attObj = JSON.parse(localStorage.attObj)
          let attid = document.getElementById('c_' + attObj.id)
          attid.innerHTML = this.local
          this.iswar = false
          this.local = ''
          if (this.player == 0) {
            attid.getElementsByTagName('a')[0].className = 'chass_b'
          } else {
            attid.getElementsByTagName('a')[0].className = 'chass_c'
          }
        }

        chass.status = 1

        //判断当前游戏是否开始
        if (!this.isStart) {

          this.isStart = true

          if (chass.item == 0) {

            this.player = 1
            this.explain = this.ex_1

          } else {

            this.explain = this.ex_2

          }
        } else {
          //玩家判断
          if (this.player == 0) { //红方执子
            this.player = 1
            this.explain = this.ex_1
          } else { //黑方执子
            this.player = 0
            this.explain = this.ex_2
          }
        }
      } else if (chass.status == 1) { //棋子为正面
        //当前棋子
        let defid = document.getElementById('c_' + chass.id)

        //格子为空
        if (defid.innerHTML == '') {

          let attObj = JSON.parse(localStorage.attObj)
          let attid = document.getElementById('c_' + attObj.id)

          if ((chass.x - attObj.x == 1 && chass.y == attObj.y)|| (chass.x - attObj.x == -1 && chass.y == attObj.y) || (chass.y - attObj.y == 1 && chass.x == attObj.x) || (chass.y - attObj.y == -1 && chass.x == attObj.x)) {

            attid.innerHTML = ''
            defid.innerHTML = this.local
            this.local = ''
            chass.item = attObj.item
            chass.level = attObj.level
            chass.name = attObj.name

            if (this.player == 0) {
              defid.getElementsByTagName('a')[0].className = 'chass_b'
              this.player = 1
              this.explain = this.ex_1
            } else {
              defid.getElementsByTagName('a')[0].className = 'chass_c'
              this.player = 0
              this.explain = this.ex_2
            }

            return

          } else {

            attid.innerHTML = this.local
            this.iswar = false
            this.local = ''
            alert('骚年，距离不够！')
            return

          }
        }


        if (!this.iswar && chass.item != this.player) {
          alert('请选择自己阵营的棋子！')
          return
        }


        if (this.att_type) { //炮攻击模式

          let attObj = JSON.parse(localStorage.attObj)
          let attid = document.getElementById('c_' + attObj.id)

          //同阵营
          if (attObj.item == chass.item) {
            alert('煮豆燃豆萁，相煎何太急')
            if (this.player == 0) {
              defid.getElementsByTagName('a')[0].className = 'chass_b'
            } else {
              defid.getElementsByTagName('a')[0].className = 'chass_c'
            }
            return
          }

          //如果选择的点在攻击范围，则攻击成功
          for (let i = 0; i < this.fireArr.length; i++) {
            if ((this.fireArr[i].x == chass.x && this.fireArr[i].y == chass.y)) {

              if (chass.name == '炮') {
                attid.innerHTML = ''
                defid.innerHTML = ''
                this.gameArr.push(chass)
                this.gameArr.push(attObj)
                return
              } else {
                this.gameArr.push(chass)
                defid.innerHTML = this.local
                chass.item = attObj.item
                chass.level = attObj.level
                chass.name = attObj.name
                attid.innerHTML = ''
                this.local = ''
                this.iswar = false
                this.att_type = false
                localStorage.attObj = JSON.stringify(chass)
                if (this.player == 0) { //红方执子
                  this.explain = this.ex_1
                  defid.getElementsByTagName('a')[0].className = 'chass_b'
									this.player = 1
                } else { //黑方执子
                  this.explain = this.ex_2
                  defid.getElementsByTagName('a')[0].className = 'chass_c'
									this.player = 0
                }
              }

              break
            }
          }



          this.fireArr = new Array()
					return

        }

        //确定炮攻击范围
        if (chass.name == '炮' && !this.iswar) {

          if (this.player == 0) {
            defid.getElementsByTagName('a')[0].className = 'chass_d'
          } else {
            defid.getElementsByTagName('a')[0].className = 'chass_e'
          }

          this.att_type = true
          this.fireArr = new Array()
          this.local = document.getElementById('c_' + chass.id).innerHTML

          let ac = chass.x //取出x坐标
          let de = chass.y //取出y坐标

          this.flag1 = false
          for (let n = this.chassArr.length - 1; n > 0; n--) {
            if ((this.chassArr[n].y == de && this.chassArr[n].x < ac) && document.getElementById('c_' + this.chassArr[n].id).innerHTML != '') {
              if (this.flag1 == false) {
                this.flag1 = true
              } else {
                this.fireArr.push(this.chassArr[n])
                this.flag1 = false
                break
              }
            }
          }

          this.flag2 = false
          for (let i = 0; i < this.chassArr.length; i++) {
            if ((this.chassArr[i].y == de && this.chassArr[i].x > ac) && document.getElementById('c_' + this.chassArr[i].id).innerHTML != '') {
              if (this.flag2 == false) {
                this.flag2 = true
              } else {
                this.fireArr.push(this.chassArr[i])
                this.flag2 = false
                break
              }

            }
          }

          this.flag3 = false
          for (let j = 0; j < this.chassArr.length; j++) {
            if ((this.chassArr[j].x == ac && this.chassArr[j].y > de) && document.getElementById('c_' + this.chassArr[j].id).innerHTML != '') {
              if (this.flag3 == false) {
                this.flag3 = true
              } else {
                this.fireArr.push(this.chassArr[j])
                this.flag3 = false
                break
              }

            }
          }

          this.flag4 = false
          for (let t = 0; t < this.chassArr.length; t++) {
            if ((this.chassArr[t].x == ac && this.chassArr[t].y < de) && document.getElementById('c_' + this.chassArr[t].id).innerHTML != '') {
              if (this.flag4 == false) {
                this.flag4 = true
              } else {
                this.fireArr.push(this.chassArr[t])
                this.flag4 = false
                break
              }

            }
          }

          this.iswar = true
          chass.attack = true
          localStorage.attObj = JSON.stringify(chass)
          return
        }


        //玩家控制自己阵营棋子
        if (this.player == chass.item && !this.iswar) {

          this.local = defid.innerHTML
          //棋子状态切换
          if (this.player == 0) {
            defid.getElementsByTagName('a')[0].className = 'chass_d'
          } else {
            defid.getElementsByTagName('a')[0].className = 'chass_e'
          }

          console.log('开启攻击模式')
          this.iswar = true
          chass.attack = true
          localStorage.attObj = JSON.stringify(chass)


        } else {


          let attObj = JSON.parse(localStorage.attObj)
          let attid = document.getElementById('c_' + attObj.id)


          //同阵营
          if (attObj.item == chass.item) {
            alert('煮豆燃豆萁，相煎何太急')
            attid.innerHTML = this.local
            this.iswar = false
            this.local = ''
            return
          }


          //异子火拼
          if ((chass.x - attObj.x == 1 || chass.x - attObj.x == -1 || chass.y - attObj.y == 1 || chass.y - attObj.y == -1) && attObj.name != '炮') {

            //兵卒吃帅
            if (attObj.level == 1 && chass.level == 7) {
              this.bing = true
            }

            //禁止帅吃兵卒
            if (attObj.level == 7 && chass.level == 1) {
              this.gen = true
            }

            if ((attObj.level < chass.level && !this.bing) || this.gen) {

              alert('打不过，尴尬了')
              attid.innerHTML = this.local
              this.iswar = false
              this.local = ''
              this.gen = false
              return

            } else if (attObj.level == chass.level) { //兑子

              attid.innerHTML = ''
              defid.innerHTML = ''
              this.gameArr.push(chass)
              this.gameArr.push(attObj)

            } else { //吃子

              this.gameArr.push(chass)
              defid.innerHTML = this.local
              attid.innerHTML = ''
              chass.item = attObj.item
              chass.level = attObj.level
              this.bing = false

            }

            console.log('攻击完毕')
            this.iswar = false
            this.local = ''

            //玩家判断，提示切换
            if (this.player == 0) { //红方执子

              this.player = 1
              this.explain = this.ex_1

            } else { //黑方执子

              this.player = 0
              this.explain = this.ex_2

            }
          } else {

            //攻击失败
            if (!this.att_type) {
              alert('骚年，距离不够！')
              attid.innerHTML = this.local
              this.iswar = false
              this.local = ''
              return
            }


          }
        }

      }

      let s = 0,
        p = 0
      for (let i = 0; i < this.gameArr.length; i++) {
        if (this.gameArr[i].item == 0) {
          s++
        } else {
          p++
        }

        if(s == 15 && p == 15){
          if((this.gameArr[i].item == 0 && this.gameArr[i].name == '炮') && (this.gameArr[i].item == 1 && this.gameArr[i].name == '炮')){
            alert('和局！')
          }
        }

      }

      if (s == 16) {
        alert('黑方胜')
      }

      if (p == 16) {
        alert('红方胜')
      }


    },
    compare: name => {
      return function(a, b) {
        return a[name] - b[name];
      }
    }
  },
  created() {
    //console.log(list)
  }
}
</script>
